<template>
    <h2>这是学生页面</h2>


    <table border="1">
        <thead>
            <tr>
                <th>ID</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            <tr v-for="item in StuInfo" :key="item.id">
                <td>{{ item.id }}</td>
                <td>{{ item.name }}</td>
                <td>{{ item.age }}</td>
                <td>
                    <button @click="update(item.id)">修改</button>
                </td>
            </tr>
        </tbody>
    </table>

</template>

<script setup lang="ts">

import { useRouter } from 'vue-router'

const router = useRouter()



const StuInfo = [
    { id: 1, name: '张三', age: 18 },
    { id: 2, name: '李四', age: 20 },
    { id: 3, name: '王五', age: 22 }
]

const update = (id: number) => {
    router.push({
        name: 'StuEdit',
        params: { id: id }
    })
}

</script>